<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>施工指导</title>
    <link rel="stylesheet" href="/css/base.css">
    <link rel="stylesheet" href="/css/select.css">
    <link rel="stylesheet" href="/css/shigong.css">
    <link rel="stylesheet" href="/css/swiper.min.css">
    <script src="/js/swiper.min.js"></script>
    <script>
        function selectCar() {
            var visibility = document.getElementById('select-fixed-car').style.visibility
            if (visibility === 'hidden') {
                document.getElementById('select-fixed-car').style.visibility = 'inherit'
            } else {
                document.getElementById('select-fixed-car').style.visibility = 'hidden'
            }
            document.getElementById('select-fixed-type').style.visibility = 'hidden'
        }

        function selectType() {
            var visibility = document.getElementById('select-fixed-type').style.visibility
            if (visibility === 'hidden') {
                document.getElementById('select-fixed-type').style.visibility = 'inherit'
            } else {
                document.getElementById('select-fixed-type').style.visibility = 'hidden'
            }
            document.getElementById('select-fixed-car').style.visibility = 'hidden'
        }

        var carName = ''
        function carClick(name) {
            carName = name
            document.getElementById('select-fixed-car').style.visibility = 'hidden'
            document.getElementById('select-fixed-type').style.visibility = 'inherit'
        }

        function typeClick(name) {
            document.getElementById('car_name').innerHTML = carName + name
            document.getElementById('select-fixed-type').style.visibility = 'hidden'
        }
    </script>
</head>
<body>
    <header class="header">
        <img src="/assets/header.png" alt="" width="100%" height="300">
        <div class="logo"><img src="/assets/logo.png" width="150"></div>
        <div class="link">
            <a href="/baojia.html" class="link_cell">
                <img src="/assets/link_3.png" height="24">
                <p>车型报价</p>
            </a>
            <a href="/zhibao.html" class="link_cell">
                <img src="/assets/link_4.png" height="24">
                <p>质保查询</p>
            </a>
            <a href="/example.html" class="link_cell">
                <img src="/assets/link_2.png" width="26">
                <p>案例展示</p>
            </a>
            <a href="/shigong.html" class="link_cell">
                <img src="/assets/link_1.png" height="24">
                <p>施工指导</p>
            </a>
        </div>
    </header>
    <div class="shigong">
        <div class="shigong_content">
            <div class="select">
                <div class="select_cell" onclick="selectCar()">
                    <img src="/assets/car.png" width="24" style="margin-top: 16px;">
                    <span>选择品牌</span>
                    <img src="/assets/car_select.png" class="select_cell_select">
                </div>
                <div class="select_cell" style="float: right;" onclick="selectType()">
                    <img src="/assets/car_type.png" width="28" style="margin-top: 16px;">
                    <span>选择车型</span>
                    <img src="/assets/car_select.png" class="select_cell_select">
                </div>
                <!-- 选择品牌 -->
                <div class="select_fixed car" id="select-fixed-car" style="visibility: hidden;">
                    <h4 class="select_fixed_title">品牌</h4>
                    <div class="select_fixed_wrap">
                        <div class="select_fixed_cell" onclick="carClick('大众')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">大众</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="carClick('奥迪')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">奥迪</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="carClick('大众')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">大众</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="carClick('大众')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">大众</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="carClick('大众')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">大众</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="carClick('大众')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">大众</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="carClick('大众')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">大众</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="carClick('大众')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">大众</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="carClick('大众')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">大众</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="carClick('大众')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">大众</h4>
                        </div>
                    </div>
                </div>
                <!-- 选择车型 -->
                <div class="select_fixed type" id="select-fixed-type" style="visibility: hidden;">
                    <h4 class="select_fixed_title" id="select-car-type">奥迪</h4>
                    <div class="select_fixed_wrap">
                        <div class="select_fixed_cell" onclick="typeClick('G30')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">G30</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="typeClick('F213')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">F213</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="typeClick('g231')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">g231</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="typeClick('F213')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">F213</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="typeClick('RW')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">RW</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="typeClick('RW')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">RW</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="typeClick('RW')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">RW</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="typeClick('SD')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">SD</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="typeClick('YRT')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">YRT</h4>
                        </div>
                        <div class="select_fixed_cell" onclick="typeClick('TRY')">
                            <img src="/assets/example_car_mark.png" width="90" height="90">
                            <h4 class="select_fixed_car_name">TRY</h4>
                        </div>
                    </div>
                </div>
            </div>
            <div class="shigong_detail">
                <h4 class="car_name" id="car_name">大众222  </h4>
                <div class="shigong_detail_desc">
                    <h4 class="shigong_detail_desc_title">施工流程</h4>
                    <p class="txt"><span class="index">1</span> 两侧边角对齐清水固定</p>
                    <p class="txt"><span class="index">2</span> 对齐开孔处，刮水固定</p>
                    <p class="txt"><span class="index">3</span> 依次对齐边角清水固定</p>
                    <p class="txt"><span class="index">4</span> 从上到下刮水固定</p>
                    <p class="txt"><span class="index">5</span> 从中间往两边依次刮水固定</p>

                    <h4 class="shigong_detail_desc_title">注意事项</h4>
                    <p class="txt"><span class="index">1</span> 润滑液比例：100：1，<br>注：根据温差不同适当增减配比例。</p>
                    <p class="txt"><span class="index">2</span> 上膜前漆面及膜面安装液喷洒均匀，<br>避免产生胶花。</p>
                    <p class="txt"><span class="index">3</span> 每次排水刮板压上次位置三分之一处，<br>避免漏刮，多刮几遍，确保刮干。</p>
                    <p class="txt"><span class="index">4</span> 装贴过程中，尽量避免膜移动，尽量一次成型，避免多次拉伸。四处包边要大小一致，表面要多喷安装液刮水才不会刮坏膜，贴完包边喷清水晾干，再用手按平，再拿烤抢300度左右收边。</p>
                    
                    <h4 class="shigong_detail_desc_title">施工验收标准及解决方案</h4>
                    <p class="txt_other txt">
                        <span class="index index_other">验收检查标准:</span>
                        <p class="sub_txt">一、膜面无水泡、尘点、胶印。</p>
                        <p class="sub_txt">二、根据车辆情况，未包边处膜距漆面边缘控制在1-2 mm内，有包边处包边两头的边角要时齐，<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;包边尺寸为5-20mm之间。且整齐美观，边缘无水泡、气泡。</p>
                        <p class="sub_txt">三、车标、字标、拉手等开口处，定位需上下左右对齐，整齐美观。</p>
                        <p class="sub_txt">四、局部部件拼接处要做到无缝拼接.</p>
                        <p class="sub_txt">六、所有边角定位明确.整齐美观。.</p>
                    </p>
                    <p class="txt_other txt">
                        <span class="index index_other">问题解决方案:</span>
                        <p class="sub_txt">一、针对水泡问题: <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;1. 膜面外观小的水泡24小时之内会漫漫消失。<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2. 膜面外观打的水泡在膜水分未干之前用硬刮平行挤压，记得要喷安装液在膜面润滑，若膜已定死，<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;可根据水分的多少选择掀开进行二次装贴，不可强行挤压。
                        </p>
                        <p class="sub_txt">二、针对胶印、尘点问题:胶印一般是由于操作不当，导致的胶变形而形成，如出现这种情况，把膜整片掀起，<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;喷洒均匀安装液，已变形部位会回弹归位，同时清洗尘点，然后进行二次装贴。</p>
                        <p class="sub_txt">三、针对褶皱问题:褶皱产生的原因为膜拉伸不到位产生，在装贴边缘中对好边角、拉伸力度由小及大，<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;直至膜与漆面完全贴合，然后清水固定，防止回弹.注意，:拉伸手法应用手掌去推，不能用手指拉.</p>
                    </p>

                </div>
                <div class="shigong_detail_car" >
                    <img src="/assets/shigong_car.png" width="500">
                    <div id="car_whole">
                        <img src="/assets/shigong/shigong_hou_baoxiang.png" data-name="hou_baoxiang" class="shigong_hou_baoxiang" onclick="setCarActive(this)">
                        <img src="/assets/shigong/shigong_hou_weixiang.png" data-name="hou_weixiang" class="shigong_hou_weixiang" onclick="setCarActive(this)">
                        <img src="/assets/shigong/shigong_qian_baoxiang.png" data-name="qian_baoxiang" class="shigong_qian_baoxiang" onclick="setCarActive(this)">
                        <img src="/assets/shigong/shigong_hou_men_top.png" data-name="hou_men" class="shigong_hou_men_top" onclick="setCarActive(this)">
                        <img src="/assets/shigong/shigong_hou_men_bottom.png" data-name="hou_men" class="shigong_hou_men_bottom" onclick="setCarActive(this)">
                        <img src="/assets/shigong/shigong_qian_men_top.png" data-name="qian_men" class="shigong_qian_men_top" onclick="setCarActive(this)">
                        <img src="/assets/shigong/shigong_qian_men_bottom.png" data-name="qian_men" class="shigong_qian_men_bottom" onclick="setCarActive(this)">
                        <img src="/assets/shigong/shigong_qian_ye_top.png" data-name="qian_ye" class="shigong_qian_ye_top" onclick="setCarActive(this)">
                        <img src="/assets/shigong/shigong_qian_ye_bottom.png" data-name="qian_ye" class="shigong_qian_ye_bottom" onclick="setCarActive(this)">
                        <img src="/assets/shigong/shigong_hou_ye_top.png" data-name="hou_ye" class="shigong_hou_ye_top" onclick="setCarActive(this)">
                        <img src="/assets/shigong/shigong_hou_ye_bottom.png" data-name="hou_ye" class="shigong_hou_ye_bottom" onclick="setCarActive(this)">
                        <img src="/assets/shigong/shigong_fa_dong.png" data-name="fa_dong" class="shigong_fa_dong" onclick="setCarActive(this)" style="opacity: 1;">
                    </div>
                    <div id="car_parts" style="text-align: center;">
                        <img src="/assets/shigong/shigong_hou_baoxiang_big.png" data-name="hou_baoxiang">
                        <img src="/assets/shigong/shigong_hou_weixiang_big.png" data-name="hou_weixiang">
                        <img src="/assets/shigong/shigong_qian_baoxiang_big.png" data-name="qian_baoxiang">
                        <img src="/assets/shigong/shigong_hou_men_big.png" data-name="hou_men">
                        <img src="/assets/shigong/shigong_qian_men_big.png" data-name="qian_men">
                        <img src="/assets/shigong/shigong_qian_ye_big.png" data-name="qian_ye">
                        <img src="/assets/shigong/shigong_hou_ye_big.png" data-name="hou_ye">
                        <img src="/assets/shigong/shigong_fa_dong_big.png" data-name="fa_dong" style="display: inline-block;">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <footer class="footer">
        <div class="footer-content">
            <img src="/assets/footer_logo.png" alt="">
            <div class="footer-phone">
                <p>全国服务热线</p>
                <p>400-600-2900</p>
            </div>
            <div class="footer-info">
                <p>粤ICP备09064614号    备案编号：11010502002098</p>
                <p>COPYRIGHT (©) 2019 中凌薄膜材料科技（上海）有限公司  版权所有</p>
            </div>
            <div class="footer-qrcode">
                <img src="/assets/footer_qrcode.png">
                <p style="text-align: center; margin-top: 5px;">扫一扫,关注公众号</p>
            </div>
        </div>
    </footer>
    <!-- Initialize Swiper -->
    <script>
        function setCarActive (e) {
            var targerEl = e
            var opacity = targerEl.style.opacity

            // 激活当前部位
            var carParts = document.getElementById('car_whole').children
            for (var index = 0; index < carParts.length; index++) {
                var element = carParts[index];
                if (targerEl.getAttribute('data-name') === element.getAttribute('data-name')) {
                    if (opacity === '0' || !opacity) {
                        element.style.opacity = 1
                    } else {
                        element.style.opacity = 0
                    }
                } else {
                    element.style.opacity = 0
                }
            }

            // 显示部位大图
            var bigCarParts = document.getElementById('car_parts').children
            for (var newIndex = 0; newIndex < bigCarParts.length; newIndex++) {
                var element = bigCarParts[newIndex];
                if (targerEl.getAttribute('data-name') === element.getAttribute('data-name')) {
                    if (opacity === '0' || !opacity) {
                        element.style.display = 'inline-block'
                    } else {
                        element.style.display = 'none'
                    }
                } else {
                    element.style.display = 'none'
                }
            }
        }
    </script>
</body>
</html>